<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>CSS控制表格边框</title>
<style type="text/css">
table{
	width:400px;
	height:300px;
	border:1px solid #30F;     /*设置table的边框*/
	/*border-collapse:collapse;*/   /*边框合并*/
	border-collapse:separate;   /*边框分离*/
	}
th,td{border:1px solid #30F;}  /*为单元格单独设置边框*/
</style>
</head>
<body>
<caption>2018腾讯手游排行榜</caption>    <!--caption定义表格的标题-->
<table>
 <tr>
    <th>热游榜</th>
    <th>游戏名</th>
    <th>类型</th>
    <th>特征</th>
 </tr>
 <tr>
    <th>1</th>
    <td>王者荣耀</td>
    <td>策略战棋</td>
    <td>3D 竞技</td>
 </tr>
 <tr>
    <th>2</th>
    <td>天龙八部手游</td>
    <td>角色扮演</td>
    <td>3D 武侠</td>
 </tr>
 <tr>
    <th>3</th>
    <td>龙之谷手游</td>
    <td>角色扮演</td>
    <td>3D 格斗</td>
 </tr>
 <tr>
    <th>4</th>
    <td>弹弹堂</td>
    <td>休闲益智</td>
    <td>Q版 竞技</td>
 </tr>
 <tr>
    <th>5</th>
    <td>火影忍者</td>
    <td>角色扮演</td>
    <td>2D 格斗</td>
 </tr>
</table>
</body>
</html>